﻿<div ng-mouseenter="isHovered = true" ng-mouseleave="isHovered = false" class="dskb-item-container">
    <div class="dskb-item" ds:kanban-draggable-item drag-type="dskb.itemType" drag-index="dskb.items.indexOf(item)" is-dragging-parent="true" ng-style="{ backgroundColor: item.backgroundColor ? item.backgroundColor : (item.itemType && item.itemType.backgroundColor ? item.itemType.backgroundColor : dskb.defaultItemType.backgroundColor) }">
        <table>
            <tr>
                <td class="dskb-gripper" ng-style="{ backgroundColor: item.color ? item.color : (item.itemType ? item.itemType.color : dskb.defaultItemType.color) }">&nbsp;</td>
                <td class="dskb-item-content">
                    <div class="dskb-property dskb-property-editor">
                        <input type="text" ng-model="item[dskb.itemNameField]" readonly="readonly"/>
                    </div>
                    <table class="dskb-property dskb-property-editor dskb-property-table">
                        <tr>
                            <td>
                                <img ng-if="dskb.assignableResources && item.assignedResource.imageUrl" ng-src="{{ item.assignedResource.imageUrl }}" class="dskb-property-image"/>
                            </td>
                            <td class="dskb-property-table">
                                <input ng-model="dskb.assignableResources ? item.assignedResource.name : null" ng-model-options="{ getterSetter: true }" readonly="readonly" class="dskb-property-secondary dskb-select-replacement"/>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </div>
    <div ng-hide="dskb.isReadOnly || item.isReadOnly || item.group.isReadOnly || item.state.isReadOnly" class="dskb-editors-area" ng-style="{ backgroundColor: item.backgroundColor ? item.backgroundColor : (item.itemType && item.itemType.backgroundColor ? item.itemType.backgroundColor : dskb.defaultItemType.backgroundColor) }">
        <div class="dskb-item-commands-container" ng-show="dskb.onEditingItem && isHovered">
            <a ng-hide="dskb.areEditItemButtonsHidden || item.isEditItemButtonHidden || item.state.areEditItemButtonsHidden || item.group.areEditItemButtonsHidden" href="javascript://" ng-click="dskb.onEditingItem({item: item})" class="dskb-button dskb-edit-button" title="{{ dskb.editItemButtonToolTip }}">
                {{ dskb.editItemButtonText }}
            </a>
        </div>
        <div ng-hide="dskb.areItemsReadOnly || item.isItemReadOnly || item.group.areItemsReadOnly || item.state.areItemsReadOnly" class="dskb-properties-container">
            <div class="dskb-property dskb-property-editor">
                <input type="text" ng-model="item[dskb.itemNameField]"/>
            </div>
            <table ng-if="dskb.assignableResources" class="dskb-property dskb-property-editor dskb-property-table">
                <tr>
                    <td>
                        <img ng-if="item.assignedResource.imageUrl" ng-src="{{ item.assignedResource.imageUrl }}" class="dskb-property-image"/>
                    </td>
                    <td class="dskb-property-table">
                        <select ng-model="item.assignedResource" ng-options="resource as resource.name for resource in dskb.assignableResources" class="dskb-property-secondary"></select>
                    </td>
                </tr>
            </table>
        </div>
    </div>
</div>
